<template>
  <!-- 表单 -->
  <el-form label-width="80px" ref="addForm" :model="formData" :rules="rules">
    <el-form-item label="学科名称" prop="subjectName">
      <el-input style="width:90%" placeholder="请输入学科名称" v-model="formData.subjectName" />
    </el-form-item>
    <el-form-item label="是否显示">
      <el-switch v-model="formData.isFrontDisplay" active-color="#13ce66" inactive-color="#ff4949"> </el-switch>
    </el-form-item>
    <el-form-item style="text-align:right">
      <el-button @click="addCancel" >取消</el-button>
      <el-button type="primary" @click="addSubmit" >确定</el-button>
    </el-form-item>
  </el-form>
</template>

<script>
import { detail, update } from '@/api/hmmm/subjects.js'
export default {
  name: 'SubJects',

  props: {
    xiugai: {
      type: Boolean,
      default: false
    }
  },
  data () {
    return {

      formData: {
        subjectName: '',
        isFrontDisplay: true
      },

      rules: {
        subjectName: [{ required: true, message: '请输入正确的学科', trigger: 'blur' }]
      },

      id: ''
    }
  },

  methods: {
    // 学科详情
    async detailFn (detailID) {
      const res = await detail(detailID)
      this.formData.subjectName = res.data.subjectName
      this.formData.isFrontDisplay = res.data.isFrontDisplay === 1 ? Boolean(true) : Boolean(false)
      this.id = res.data.id
    },
    // 取消按钮
    addCancel () {
      this.$emit('Dlogs', false)
      // this.$emit('close')
      this.$refs.addForm.resetFields()
    },
    // 确定按钮
    addSubmit () {
      this.$refs.addForm.validate(async valid => {
        if (valid) {
          if (this.xiugai) { // 修改状态
            await update({ id: this.id, ...this.formData })
          } else { // 新增状态
            this.$emit('enterEv', { ...this.formData })
          }
          this.$emit('Dlogs', false)
          this.$refs.addForm.resetFields()
        } else {
          return false
        }
      })
    }
  }
}
</script>

<style scoped lang="less"></style>
